/*
 * Copyright 2011 Clean GWT
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
 * in compliance with the License. You may obtain a copy of the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software distributed under the License
 * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
 * or implied. See the License for the specific language governing permissions and limitations under
 * the License.
 */
package com.cleangwt.bootstrap.client.ui;

import com.cleangwt.bootstrap.client.style.Styles;
import com.cleangwt.user.client.Elements;
import com.google.gwt.dom.client.Document;
import com.google.gwt.dom.client.Element;
import com.google.gwt.user.client.ui.ComplexPanel;
import com.google.gwt.user.client.ui.SimplePanel;
import com.google.gwt.user.client.ui.Widget;

/**
 * The slideshow for cycling through elements like a carousel.
 * 
 * @author Jess
 * @version 1.0
 * @since 1.0
 * @see http://getbootstrap.com/javascript/#carousel
 */
public class Carousel extends ComplexPanel {
  // style
  private static final String DEFAULT_STYLENAME = "carousel";
  private static final String CAPTION_STYLE = "carousel-caption";
  private static final String CONTROL_STYLE = "carousel-control";
  private static final String INDICATOR_STYLE = "carousel-indicators";
  private static final String INNER_STYLE = "carousel-inner";
  private static final String ITEM_STYLE = "item";
  private static final String LEFT_STYLE = "left";
  private static final String RIGHT_STYLE = "right";

  // data model
  private static final String DATA_SLIDE = "data-slide";
  private static final String SLIDE_PREV = "prev";
  private static final String SLIDE_NEXT = "next";
  private static final String DATA_TARGET = "data-target";
  private static final String DATA_SLIDE_TO = "data-slide-to";

  /**
   * Creates a carousel with the specified id.
   */
  public Carousel() {
    String id = Document.get().createUniqueId();
    Element element = Document.get().createDivElement();
    Element inner = Document.get().createDivElement();
    Element indicator = Document.get().createOLElement();
    Element rightControl = Document.get().createAnchorElement();
    Element leftControl = Document.get().createAnchorElement();
    Element prevIcon = Document.get().createSpanElement();
    Element nextIcon = Document.get().createSpanElement();

    element.setId(id);
    element.appendChild(indicator);
    element.appendChild(inner);
    element.appendChild(leftControl);
    element.appendChild(rightControl);

    this.setElement(element);
    this.setStyleName(DEFAULT_STYLENAME);
    this.addStyleName(Styles.SLIDE);

    inner.setClassName(INNER_STYLE);
    indicator.setClassName(INDICATOR_STYLE);

    leftControl.setClassName(CONTROL_STYLE);
    leftControl.setAttribute("href", "#" + id);
    leftControl.setAttribute(DATA_SLIDE, SLIDE_PREV);
    leftControl.addClassName(LEFT_STYLE);
    leftControl.appendChild(prevIcon);

    rightControl.setClassName(CONTROL_STYLE);
    rightControl.setAttribute("href", "#" + id);
    rightControl.setAttribute(DATA_SLIDE, SLIDE_NEXT);
    rightControl.addClassName(RIGHT_STYLE);
    rightControl.appendChild(nextIcon);

    prevIcon.setClassName(Styles.ICON_PREV);
    nextIcon.setClassName(Styles.ICON_NEXT);
  }

  /**
   * Adds a item.
   * 
   * @param item the item to add
   */
  public void addItem(Widget item) {
    this.addItem(null, item);
  }

  /**
   * Adds a item with caption.
   * 
   * @param caption the caption
   * @param item the item to add
   */
  public void addItem(String caption, Widget item) {
    SimplePanel shell = new SimplePanel();
    Element captionElement = Document.get().createDivElement();

    shell.setWidget(item);
    shell.getElement().appendChild(captionElement);
    shell.addStyleName(ITEM_STYLE);

    captionElement.setClassName(CAPTION_STYLE);
    captionElement.setInnerHTML(caption);

    Element inner = Elements.getByClass(getElement(), INNER_STYLE);
    Element indcators = Elements.getByClass(getElement(), INDICATOR_STYLE);
    Element li = Document.get().createLIElement();
    if (inner.getChildCount() == 0) {
      shell.addStyleName("active");
    }
    li.setAttribute(DATA_TARGET, "#" + getElement().getId());
    li.setAttribute(DATA_SLIDE_TO, String.valueOf(inner.getChildCount()));
    indcators.appendChild(li);
    this.add(shell, inner);
  }

}
